<template>
  <el-table :data="relTableData" border style="width: 100%">
    <el-table-column prop="columnA" label="重要审计点" width="350px">
    </el-table-column>
    <el-table-column prop="columnB" label="第一省份"> </el-table-column>
    <el-table-column prop="columnC" label="风险数量（个）"> </el-table-column>
    <el-table-column prop="columnD" label="第二省份"> </el-table-column>
    <el-table-column prop="columnE" label="风险数量（个）"> </el-table-column>
    <el-table-column prop="columnF" label="第三省份"> </el-table-column>
    <el-table-column prop="columnG" label="风险数量（个）"> </el-table-column>
  </el-table>
</template>

<script>
export default {
  data() {
    return {
      relTableData: [],
      tableData: [
        {
          columnA: '营销资源管理涉及的赠送有价卡发起充值号码集中度模型',
          columnB: '上海',
          columnC: '27458',
          columnD: '四川',
          columnE: '23444',
          columnF: '新疆',
          columnG: '23225'
        },
        {
          columnA: 'BOSS有价卡状态记录连续性模型',
          columnB: '山东',
          columnC: '36541',
          columnD: '浙江',
          columnE: '23547',
          columnF: '江西',
          columnG: '21426'
        }
      ],
      tableDataB: [
        {
          columnA: '营销资源管理涉及的赠送有价卡发起充值号码集中度模型',
          columnB: '北京',
          columnC: '17458',
          columnD: '云南',
          columnE: '12543',
          columnF: '新疆',
          columnG: '11025'
        },
        {
          columnA: 'BOSS有价卡状态记录连续性模型',
          columnB: '山东',
          columnC: '36541',
          columnD: '浙江',
          columnE: '23547',
          columnF: '江西',
          columnG: '21426'
        }
      ]
    }
  },

  created() {
    this.relTableData = this.tableData
    this.$bus.$on('change', val => {
      if (val === '营销资源管理涉及的赠送有价卡发起充值号码集中度模型')
        this.relTableData = this.tableData
      if (val === 'BOSS有价卡状态记录连续性模型')
        this.relTableData = this.tableDataB
    })
  }
}
</script>

<style lang="scss" scoped>
.pagination {
  float: right;
  margin: 10px;
}
</style>
